/* Created by jankoatwarpspeed.com */
http://jqueryvalidation.org/
(function($) {
    $.fn.formToWizard = function(options) {
    	options = $.extend({  
            submitButton: "" 
        }, options); 
    	
        var element = this;

        //Contamos los pasos en función de las etiquetas pagform
        var steps = $(element).find(".pagform");
        var count = steps.size();
        //Creamos variable que reprsenta el botton submit
        var submmitButtonName = "#" + options.submitButton;
        //Lo mostramos por defecto para que no se oculte cuando no haya más que un paso
        $(submmitButtonName).show();

        // 2
        //Antes del elemento pagform ponemos este código
        $(element).before("<ul id='steps'></ul>");

        steps.each(function(i) {
        	if(count>1){
        		$(submmitButtonName).hide();
        		//Etiquetas superiores que identifican los pasos
	            $(this).wrap("<div id='step" + i + "'></div>");
	            $(this).append("<p id='step" + i + "commands'></p>");
	
	            // 2
	            var name = $(this).find("legend").html();
	            $("#steps").append("<li id='stepDesc" + i + "'>Paso " + (i + 1) + "<span>" + name + "</span></li>");
	
	            if (i == 0) {
	                createNextButton(i);
	                selectStep(i);
	            }
	            else if (i == count - 1) {
	                $("#step" + i).hide();
	                createPrevButton(i);
	            }
	            else {
	                $("#step" + i).hide();
	                createPrevButton(i);
	                createNextButton(i);
	            }
        	}else{
        		$(submmitButtonName).show();
        	}
        });

        function createPrevButton(i) {
            var stepName = "step" + i;
            $("#" + stepName + "commands").append("<a href='#jump' id='" + stepName + "Prev' class='prev'></a>");

            $("#" + stepName + "Prev").bind("click", function(e) {
            	//No deja navegar hacia atras hasta que el formulario sea validado correctamente
            	//if ($("#pasosForm").valid()){
	                $("#" + stepName).hide();
	                $("#step" + (i - 1)).show();
	                $(submmitButtonName).hide();
	                selectStep(i - 1);
            	//}
            });
        }

        function createNextButton(i) {
            var stepName = "step" + i;
            $("#" + stepName + "commands").append("<a href='#jump' id='" + stepName + "Next' class='next'></a>");

            $("#" + stepName + "Next").bind("click", function(e) {
            	//Se valida la pantalla actual antes de pasar a la siguiente
            	if ($("#pasosForm").valid()){
	                $("#" + stepName).hide();
	                $("#step" + (i + 1)).show();
	                if (i + 2 == count)
	                    $(submmitButtonName).show();
	                selectStep(i + 1);
            	}
            });
        }

        function selectStep(i) {
            $("#steps li").removeClass("current");
            $("#stepDesc" + i).addClass("current");
        }

    }
    

    
})(jQuery); 